<template>
    <div style="margin-bottom: -24px;">
        <div style="overflow: auto">
            <div>
                <Form :label-width="labelWidth || 130" inline>
                    <slot></slot>
                    <slot v-if="!hide" name="hide"></slot>
                    <div style="display: inline-block;float: right">
                        <slot name="btn"></slot>
                        <FormItem v-if="!hideBtn" :label-width="0">
                            <a type="text" style="margin-left: 10px;" @click="hide =! hide">
                                {{ hide ? '展开' : '收起' }}
                                <Icon v-if="hide" type="ios-arrow-down"/>
                                <Icon v-else type="ios-arrow-up"/>
                            </a>
                        </FormItem>
                    </div>
                </Form>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: "sl-query",
    props:['labelWidth','hideBtn'],
    data() {
        return {
            hide: true
        }
    }
}
</script>

<style scoped>

</style>
